
 document.addEventListener('DOMContentLoaded', function(event) {
            // 修正选择器：使用类名而非标签名
            let circles = document.querySelectorAll('.circle');
            
            circles.forEach(function(circle) {
                let degree = 0;
                var targetDegree = parseInt(circle.getAttribute('data-degree'));
                let color = circle.getAttribute('data-color');
                let number = circle.querySelector('.number');
                
                // 初始化渐变背景
                circle.style.background = `conic-gradient(${color} 0%, #222 0%)`;
                
                var interval = setInterval(function() {
                    degree += 1;
                    
                    if (degree > targetDegree) {
                        clearInterval(interval);
                        return;
                    }
                    
                    // 应用渐变背景
                    circle.style.background = `conic-gradient(${color} ${degree}%, #222 0%)`;
                    
                    // 更新数字显示
                    number.innerHTML = degree + '<span>%</span>';
                    number.style.color = color;
                }, 50);
            });
        });